<template>
  <Layout class="app-layout">
    <LayoutSider class="app-layout__slider">
      <AppSlider />
    </LayoutSider>
    <LayoutContent class="app-layout__content">
      <div class="app-layout__content-inner">
        <RouterView />
      </div>
    </LayoutContent>
  </Layout>
</template>

<script setup>
import { Layout, LayoutContent, LayoutSider } from 'ant-design-vue';
import { RouterView } from 'vue-router';
import AppSlider from './slider/index.vue';
</script>

<style scoped lang="less">
.app-layout {
  height: 100%;

  &__content {
    padding: 16px;

    &-inner {
      background-color: #fff;
      width: 100%;
      height: 100%;
      border-radius: 6px;
      overflow: hidden;
    }
  }
}
</style>
